<!--列表页面的关键字部分-->
<template>
  <div class="infor">
      <ul class="inforList">
        <li v-for="(item,index) in activeInformation">
          <p v-if=" item.prefWay != 3"   v-html='transfor(item.auditOpinion,item)'></p>
          <p v-if=" item.prefWay == 3"><span v-for="(val,index) in item.auditOpinion.split('&')" :key="index" style="display:block;" v-if ="val" v-html='transfor(val,item)'></span></p>
          <p class="time">有效期：{{item.startTime.substr(5)}} — {{item.endTime.substr(5)}}</p>
        </li>
      </ul>
  </div>
</template>

<script>
   import { queryActiveInfor} from '@/utils/ReturnAxios'
   import { mapGetters, mapMutations } from "vuex";

  export default {
    data() {
      return {
        activeInformation:null,
      }
    },

    computed: {
      ...mapGetters('lyj', [
				"activeInfor"
			]),
    },
    methods: {
       // 活动信息
      async initialInfor() {
        var res = await queryActiveInfor(this.$route.query.promCode)
        this.activeInformation = res.data.data
        console.log('活动信息',this.activeInformation)
      },

      transfor(val,item) {
         console.log('val.',item.saleType,item)
         console.log('this.activeInfor',this.activeInfor)
         var methodUnit, unit, x, infor
          
        // 买赠 多买
        if(item.saleType == 'buyPresent'|| item.saleType == 'overBuy') {
            unit = item.fullElement ? '元' : (this.activeInfor.goodsType == 6 || this.activeInfor.goodsType  == 7) ? 'kg' : '件'
            infor = val.replace(/件/g, unit) 
        } else {
            infor = val
        }
        methodUnit = unit ? unit : '元'
        if (this.activeInfor.numOrMoneyShort) {
            x =  methodUnit == '元' ? this.activeInfor.numOrMoneyShort : parseFloat(this.activeInfor.numOrMoneyShort).toFixed(0)
        }
        var inhtmlColor = x ? infor + '，还差' + x + methodUnit : infor
        return inhtmlColor
      }
    },
    created() {
      this.initialInfor();
    }
  }

</script>

<style>
 .red {
   color: #f00;
 }
 .time {
   color: #333;
   margin-top: 0.3rem;
 }
 .inforList {
   text-align: left;
   padding: 0 0.5rem;
 }
 .inforList p {
   color: #333;
   font-weight:500;
 }
</style>
